<template>
    <el-button @click="centerDialogVisible = true,$emit('xiuGai')"   :style="cssstyle"  >
        <slot></slot>
    </el-button>
    <el-dialog v-model="centerDialogVisible" title="请输入内容" width="30%" align-center>
        <el-form label-width="100px" :model="formmodel">
            <el-form-item v-for="item in formListName" :label="item.name" :key="item.key" >
                <!-- 删除数据 -->
                <el-input v-model="formmodel[item.key] " />
            </el-form-item>
        </el-form>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="centerDialogVisible = false">取消</el-button>
                <el-button type="primary" @click="centerDialogVisible = false,sub(),$emit('subadd')">
                    确认
                </el-button>
            </span>
        </template>
    </el-dialog>
</template>
<script lang="ts" setup>
import { ref, toRefs,inject } from 'vue'
import { onMounted } from 'vue'
import { useCounterStore } from "../pinia/index.js"
import { storeToRefs } from "pinia"
import { computed } from 'vue'
import { add } from 'lodash'
const centerDialogVisible = ref(false)
// pinia仓库对象
const store = useCounterStore()
const props = defineProps(["cssstyle"])
const { formListName, formmodel } = storeToRefs(store)
const foocopy = formListName
function sub (){
    store.add()
}
const emit = defineEmits(["subadd","xiuGai"])
const cssstyle = inject("csstable")

//表单数据
onMounted(() => {
})
</script>
<style scoped>
.dialog-footer button:first-child {
    margin-right: 10px;
}
</style>